import {messages} from "share/common";
import React from 'react'
import { connect } from 'react-redux'
import { Button, Badge } from 'antd'
import SearchArea from 'components/search-area'
import creditModelService from 'containers/credit-setting/credit-model/credit-model.service'
import SlideFrame from 'components/slide-frame'
import NewCreditRulesGroup from 'containers/credit-setting/credit-model/credit-model-detail/new-credit-rules-group'
import menuRoute from 'routes/menuRoute'
import errorMessage from 'share/errorMessage'
import ResizeTable from 'components/resize-table';

class CreditModelRule extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      searchForm: [{
        type: 'input', id: 'ruleSetCode', label: messages('credit-setting.key51')/*规则集代码*/
      },{
        type: 'input', id: 'ruleSetName', label: messages('credit-setting.key52')/*规则集名称*/
      },{
        type: 'radio', id: 'ruleTypeId', label: messages('credit-setting.key53')/*规则类型*/,
        options: [
          { label: messages('financial-management.key367'/*全部*/), value: 'all' },
          { label: messages('credit-setting.key112')/*节点管理*/, value: '1001' },
          { label: messages('credit-setting.key54')/*手动管理*/, value: '1002'},
          { label: messages('credit-setting.key113')/*定时管理*/, value: '1003'},
        ],
        defaultValue: 'all'
      }],
      columns: [{
        title: messages('common.sequence')/*序号*/, dataIndex: 'index', width: 48
      },{
        title: messages('credit-setting.key55')/*规则集编码*/, dataIndex: 'ruleSetCode'
      },{
        title: messages('credit-setting.key52')/*规则集名称*/, dataIndex: 'ruleSetName'
      },{
        title: messages('credit-setting.key53')/*规则类型*/, dataIndex: 'ruleTypeId',
        render: ruleTypeId => ruleTypeId === 1001 ? messages('credit-setting.key112')/*节点管理*/ :
          (ruleTypeId === 1002 ? messages('credit-setting.key54')/*手动管理*/ : messages('credit-setting.key113')/*定时管理*/)
      },{
        title: messages('common.remark')/*备注*/, dataIndex: 'comment'
      },{
        title: messages('common.column.status')/*状态*/, dataIndex: 'valid', render: valid => (
          <Badge status={valid ? 'success' : 'error'}
                 text={valid ? messages("common.status.enable") : messages("common.status.disable")}/>
        )
      }],
      pagination: {
        total: 0
      },
      loading: false,
      data: [],
      page: 0,
      size: 10,
      searchParams: {},
      showSlideFrame: false
    };
  }

  componentWillMount(){
    this.getList();
  }

  getList = () => {
    const { page, size, searchParams } = this.state;
    this.setState({ loading: true });
    creditModelService.getCreditRulesGroups(Object.assign({}, searchParams, { page, size, modelId: this.props.creditModel.id } )).then(res => {
      let data = res.data;
      data.map((item, index) => {
        item.index = page * size + index + 1;
      });
      this.setState({
        data,
        loading: false,
        pagination: {
          total: Number(res.headers['x-total-count']),
          onChange: this.onChangePager,
          current: page + 1
        }
      })
    }).catch(e => {
      errorMessage(e.response);
      this.setState({ loading: false });
    })
  };

  search = result => {
    if(result.ruleTypeId === 'all')
      delete result.ruleTypeId;
    this.setState({ page: 0, searchParams: result }, this.getList);
  };

  clear = () => {
    this.setState({ page: 0, searchParams: {} }, this.getList);
  };

  //分页点击
  onChangePager = (page) => {
    if(page - 1 !== this.state.page)
      this.setState({page: page - 1}, this.getList)
  };

  handleNew = () => {
    this.setState({
      showSlideFrame: true
    })
  };

  handleCloseFrame = flag => {
    this.setState({ showSlideFrame: false });
    if(flag){
      this.getList()
    }
  };

  handleRowClick = record => {
    this.context.router.push(menuRoute.getRouteItem('credit-model-rules-detail').url
      .replace(':setId', record.id)
      .replace(':id', this.props.creditModel.id)
    )
  };

  render() {
    const { searchForm, pagination, columns, loading, data, showSlideFrame } = this.state;
    return (
      <div>
        <SearchArea searchForm={searchForm}
                    clearHandle={this.clear}
                    submitHandle={this.search} />
        <div className="table-header">
          <div className="table-header-title">{messages('common.total',{total:`${pagination.total}`})}</div>  {/*共搜索到*条数据*/}
          <div className="table-header-buttons">
            <Button type="primary" onClick={this.handleNew}>{messages('credit-setting.key56')/*新建规则集*/}</Button>
          </div>
        </div>
        <ResizeTable
          columns={columns}
          size="middle"
          bordered
          rowKey="id"
          pagination={pagination}
          loading={loading}
          dataSource={data}
          onRow={record => ({
            onClick: () => this.handleRowClick(record)
          })}/>
        <SlideFrame show={showSlideFrame}
                    params={{ showSlideFrame }}
                    title={messages('credit-setting.key56')/*新建规则集*/}
                    onClose={() => this.setState({ showSlideFrame: false })}
                    afterClose={this.handleCloseFrame}
                    content={NewCreditRulesGroup}/>

      </div>
    )
  }
}

CreditModelRule.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    creditModel: state.creditSetting.creditModel
  }
}

export default connect(mapStateToProps)(CreditModelRule)
